<template>
  <avue-crud :option="option" :data="data" @row-update="addUpdate" @row-save="rowSave" @row-del="handleRowDelete"></avue-crud>
</template>

<script>
export default {
  name: 'tablefunctionConfig',
  data() {
    return {
      data: [],
      option: {
        border: true,
        addBtn: false,
        cellBtn: true,
        addRowBtn: true,
        viewBtn: false,
        editBtn: true,
        delBtn: true,
        index: true,
        menu: true,
        columnBtn: false,
        refreshBtn: false,
        indexLabel: '序号',
        column: [
          {
            label: '功能类型',
            prop: 'functionType',
            cell: true,
            minWidth: 150
          },
          {
            label: '功能名称',
            cell: true,
            prop: 'functionName',
            minWidth: 150
          },
          {
            label: 'URL地址',
            cell: true,
            prop: 'functionUrl',
            minWidth: 200
          },
          {
            label: '请求方式',
            cell: true,
            prop: 'functionUrlType',
            minWidth: 150,
            type: 'select',
            value: 'get',
            dicData: [
              {
                label: 'get',
                value: 'get'
              },
              {
                label: 'post',
                value: 'post'
              },
              {
                label: 'delete',
                value: 'delete'
              },
              {
                label: 'put',
                value: 'put'
              }
            ]
          },
          {
            label: '字段参数名',
            cell: true,
            prop: 'paramName',
            span: 7,

            minWidth: 150
          },
          {
            label: '功能序号',
            cell: true,
            prop: 'sequence',
            minWidth: 150,
            value: 'text'
          },
          {
            label: '图标',
            cell: true,
            prop: 'iconName',
            minWidth: 150,
            type: 'select',
            value: 'refresh',
            dicData: [
              {
                label: 'refresh',
                value: 'refresh'
              },
              {
                label: 'add',
                value: 'add'
              },
              {
                label: 'create',
                value: 'create'
              },
              {
                label: 'description',
                value: 'description'
              },
              {
                label: 'close',
                value: 'close'
              }
            ]
          },

          {
            label: '颜色',
            cell: true,
            prop: 'color',
            minWidth: 150,
            type: 'select',
            value: 'btn-info',
            dicData: [
              {
                label: 'btn-info',
                value: 'btn-info'
              },
              {
                label: 'btn-success',
                value: 'btn-success'
              },
              {
                label: 'btn-primary',
                value: 'btn-primary'
              },
              {
                label: 'btn-danger',
                value: 'btn-danger'
              },
              {
                label: 'btn-warning',
                value: 'btn-warning'
              }
            ]
          }
        ]
      }
    };
  },
  methods: {
    rowSave(form, done) {
      this.$emit('change', form);
      done();
    },
    addUpdate(form, done) {
      this.$emit('change', form);
      done();
    },
    handleRowDelete(row, index) {
      this.data.splice(index, 1);
    }
  }
};
</script>

<style scoped></style>
